<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <h1 id="title">我喜欢打篮球！</h1>
    <script>
        /* 1.案例：闪烁的字体（1秒1变色）  */
        var colors = ["red","blue","yellow","pink","green","orange","black"];
        var i = 0;
        function bian(){
            document.getElementById("title").style.color = colors[i++];
            if(i == colors.length){
                i = 0; //颜色重新开始
            }
        }
        setInterval(bian,100);//每个0.1秒，执行一次bian函数

        /* 2.在上述的基础上，扩展成闪烁的电子时钟 */
        function time(){
            var d = new Date();
            var str = d.getFullYear()+"年"+(d.getMonth()+1)+"月"+d.getDate()+"号"
                     +d.getHours()+"时"+d.getMinutes()+"分"+d.getSeconds()+"秒";
            document.getElementById("title").innerHTML = str;
        }
        setInterval(time,1000);//每个1秒，执行一次time函数
    </script>
</body>
</html>